<template>
  <div id="app">
    <div class="navbar-wrapper">
      <nav class="navbar ">
        <div id="navbar">
          <div class="container">
            <ul class="nav navbar-nav">
              <li><router-link to="">沙发网</router-link></li>
              <li><router-link to="">应用市场</router-link></li>
              <li><router-link to="">客户端下载</router-link></li>
              <li><router-link to="">安装教程</router-link></li>
              <li><router-link to="">产品库</router-link></li>
              <li class="active">
                <router-link to="/">开发者平台</router-link>
              </li>
            </ul>
          </div>
        </div>
      </nav>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style >
*{
  margin: 0;
  padding: 0;
}
.navbar {
  background-color: rgb(51, 51, 51);
}
ul li a {
  color: white;
  font-size: 18px;
  width: 150px;
}
.nav > li > a:hover {
  background-color: #000;
  color: rgb(255, 128, 0);
}
.container {
  width: 1200px;
  border-left: 1px solid gray;
  border-right: 1px solid gray;
  margin: 0 auto;
  padding: 0;
}
.nav> li > a:hover,
 .nav > li > a:focus {
    background-color: #000;
  color: rgb(255, 128, 0);
}
</style>